<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="telephone=no" name="format-detection">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <title>宣和艺网-共享艺术服务平台</title>
    <link rel="stylesheet" type="text/css" th:href="@{/css/mobile/public.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/css/mobile/jquery.bxslider.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/css/mobile/style.css}" />
    <script type="text/javascript" th:src="@{/js/mobile/jquery1.11.3.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/mobile/jquery.bxslider.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/mobile/index.js}"></script>
  <script type="text/javascript" th:src="@{/js/mobile/redirectPc.js}"></script>
    <script type="text/javascript" th:src="@{/js/baiduhm.js}" ></script>

</head>

<body>
<!--手机搜索begin-->
<div id="nav-search">

</div>
<div class="drawer-section search_div">
    <div class="search_con">
        <form action="" style="width: 100%;height: 100%;">
            <input name="names" type="text" class="input1" value="搜索" onFocus="if(value=='搜索'){value=''}"
                   onBlur="if(value==''){value='搜索'}" />
            <input type="submit" value="" class="bnt1" />
        </form>
    </div>
</div>
<!--top-->
<div id="top">
    <div th:replace="~{mobile/event/component/header :: event_menu}"></div>
    <div class="muen1" style="right: 56px;"> <span class="muenX"></span>
        <span class="muenZ"></span> </div>
    <div class="muen"> <span class="muenX"></span> <span class="muenY"></span> <span class="muenZ"></span> </div>
</div>
<!--/top-->

<!--main-->
<div class="main">
    <div class="theme_layoutbox_1208765579" style="position: relative;width: 100%;height: auto;transform-origin: top left;overflow-x: hidden;">
        <div style="overflow-x: hidden;">
            <img th:src="${eventExhibitionTemp.bannerUrl}" style="width: 100%;height: auto;overflow: hidden">
        </div>
    </div>

    <style>
        #page-content-2 img{
            width: 100% !important;
            height: auto;
        }
    </style>

    <div class="wrap clearfloat">
        <div class="pshowtit">
            《[[ ${artwork.name} ]]》
            <span>[[ ${artwork.artistName} ]]</span>
        </div>

        <div class="show-pic">
            <img th:src="${artwork.url}" style="width: 100%" />
        </div>

        <div class="homeDzzxBW">
            <ul class="sliderHomeDzzc clearfloat">
                <li><a href="">
                    <div class="pic">
                        <img th:src="${artwork.url}" />
                    </div>

                </a>
                </li>

                <li th:each="artworkOtherPic:${artworkOtherPics}"><a href="">
                    <div class="pic"><img
                            th:src="${artworkOtherPic.url}" />
                    </div>

                </a>
                </li>


            </ul>
        </div>




        <div class="aboutR">
            <div class="detailed_pro">
                <div class="protit">
                    <span>艺术品详细</span>
                </div>
                <table>
                    <tbody>
                    <tr>
                        <td style="width: 40%; background: rgb(245, 247, 248); font-weight: bold;">艺术品名称</td>
                        <td>[[ ${artwork.name} ]]</td>
                    </tr>
                    <tr>
                        <td style="width: 40%; background: rgb(245, 247, 248); font-weight: bold;">作者</td>
                        <td>[[ ${artwork.artistName} ]]</td>
                    </tr>
                    <tr>
                        <td style="width: 40%; background: rgb(245, 247, 248); font-weight: bold;">艺术品类型</td>
                        <td>[[ ${artwork.artTypeName} ]]</td>
                    </tr>
                    <tr>
                        <td style="width: 40%; background: rgb(245, 247, 248); font-weight: bold;">创作时间</td>
                        <td>[[ ${artwork.createSrt} ]]</td>
                    </tr>
                    <tr>
                        <td style="width: 40%; background: rgb(245, 247, 248); font-weight: bold;">编号</td>
                        <td>[[ ${artwork.artworkNum} ]]</td>
                    </tr>
                    <tr>
                        <td style="width: 40%; background: rgb(245, 247, 248); font-weight: bold;">规格</td>
                        <td>[[ ${artwork.spec} ]]</td>
                    </tr>
                    <tr>
                        <td style="width: 40%; background: rgb(245, 247, 248); font-weight: bold;">价格</td>
                        <td>[[ ${artwork.price == null || artwork.price == 0 ? '****' : artwork.price + "元"} ]]</td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <div class="parameter">
                <div class="protit">
                    <span>艺术品介绍</span>
                </div>
                <p><div
                    th:title="${artwork.remarks}" th:utext="${artwork.remarks}"></div></p>
            </div>
        </div>
    </div>

</div>

<!--/main-->

<!--/main-->

<!--footer-->
<div th:replace="~{mobile/component/footer :: footer}"></div>
<!--/footer-->

<!--wap-->
<div th:replace="~{mobile/component/footer :: footer_menu}"></div>
<!--/wap-->

<div class="wapBg"></div>
</body>
<script type="text/javascript">
    $('.slider1').bxSlider({
        'auto': true,
        'controls': true,
        'touchEnabled': true,
        'pager': true,
        'speed': 1000,
        'pause': 4000,

    })

    $('.sliderHomeSpT').bxSlider({
        'auto': false,
        'controls': true,
        'touchEnabled': true,
        'pager': true,

    })

    var lineW = $(".lineW span").width();
    $('.sliderHomeSpB').bxSlider({
        'auto': false,
        infiniteLoop: true,
        'controls': true,
        'touchEnabled': true,
        'pager': true,
        'slideWidth': '204',
        'minSlides': 2,
        'maxSlides': 5,
        'moveSlides': 5,
        onSlideAfter: function ($slideElement, oldIndex, newIndex) {
            var num = $(".homeSpBW .bx-pager .bx-pager-item").length;
            var lineWW = $(".lineW").width();


            if (newIndex == 0) {
                $(".lineW span").css({
                    "width": lineW + 'px'
                })
            } else {
                $(".lineW span").css({
                    "width": (lineWW / num) * (newIndex + 1) + 'px'
                })
            }

        },


    })

    $('.sliderHomeDzzc').bxSlider({
        'auto': true,
        'controls': true,
        'touchEnabled': true,
        'pager': false,
        'slideWidth': '280',
        'minSlides': 2,
        'maxSlides': 4,
        'moveSlides': 1,
        'speed': 600,
        //	    'slideMargin': 20
    })





</script>

</html>
